Skip to content

feat: added vercel blob as intermediate layer#657

Open
sachigoyal wants to merge 4 commits into
Merit-Systems:masterfrom
sachigoyal:sachi/next-image
Open

feat: added vercel blob as intermediate layer#657
sachigoyal wants to merge 4 commits into
Merit-Systems:masterfrom
sachigoyal:sachi/next-image

Conversation

@sachigoyal

@sachigoyal sachigoyal commented Nov 2, 2025

Copy link
Copy Markdown
Contributor

tackles #561

current flow

User adds images → Submit form → Upload to Vercel Blob (returns URLs)
                                           ↓
API returns base64 to user ← Gemini/GPT returns processed image
Screen.Recording.2025-11-13.at.12.29.47.AM.mov

@vercel

vercel Bot commented Nov 2, 2025

Copy link
Copy Markdown
Contributor

@sachigoyal is attempting to deploy a commit to the Merit Systems Team on Vercel.

A member of the Team first needs to authorize it.

@sachigoyal

Copy link
Copy Markdown
Contributor Author

@sragss can you take a look

Comment thread templates/next-image/src/components/image-generator.tsx
Comment thread templates/next-image/src/lib/server-blob-utils.ts Outdated
@sachigoyal

Copy link
Copy Markdown
Contributor Author

@rsproule hey you can take a look again. everything seems to work. let me know if you want more changes

@vercel

vercel Bot commented Nov 12, 2025

Copy link
Copy Markdown
Contributor

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Preview Comments Updated (UTC)
echo-next-image Error Error Nov 12, 2025 3:25pm

@rsproule rsproule left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

few little things. also have you been able to test this locally? a demo video / screen recording would be super helpful for a change like this

Comment thread templates/next-image/.env.example
// For example: verify user session, check quotas, etc.

return {
allowedContentTypes: ['image/jpeg', 'image/png', 'image/gif', 'image/webp'],

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

HEIC/HEIF ?

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

the problem with these formats are that we can't render on the input box properly as browsers (mostly) don't support this format. we have to come up with hacks to convert to some other format (like png/jpg) and then render
do you think its worth installing few libraries and writing code to support this? or do you have any other plan?
let me know

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Some models do support HEIC. But fair enough, we can consider this out of scope but its actually pretty trivial to do this conversion for browser: https://github.com/alexcorvi/heic2any

import heic2any from "heic2any";

const jpegBlob = await heic2any({ blob, toType: "image/jpeg" });
const url = URL.createObjectURL(jpegBlob);

document.querySelector("img").src = url;

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

i actually gave it a try. it couldn't convert my iphone's heic format pictures
it throws error 'ERR_LIBHEIF format not supported'. thats why skipped it

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants